<template>
  <div class="child">
    <h2>子组件</h2>
    {{ title }}
    <input
      type="text"
      v-model="sonVal"
    />
  </div>
</template>
<script>
export default {
  // props 的值是只读
  props: ['title'],
  data() {
    return {
      sonVal: ''
    }
  },
  created() {
    this.sonVal = this.title
  },
  watch: {
    sonVal(newVal) {
      this.$emit('update:title', this.sonVal)
    }
  }
  // methods: {
  //   handleChangeTitle() {
  //     this.$emit('update:title', '新标题')
  //   }
  // }
}
</script>
<style lang="scss" scoped></style>
